<template>
	<view>
		<!-- 下拉框 -->
		<picker @change="xiala($event)" :value="index1" :range="list1" range-key="title">
			<view v-if="index1 == -1" class="uni-input" style="color: grey;">
				请选择{{dat.item.content}}
			</view>
			<view v-else class="uni-input">{{list1[index1].title}}</view>
		</picker>
	</view>
</template>

<script>
	export default {
		data() {
			// 日期
			// const currentDate = this.getDate({format: true})
			return {
				// 下拉框
				index1: 0,
				list1: [{
					value: 'red',
					title: '红色'
				}, {
					value: 'green',
					title: '绿色'
				}, {
					value: 'blue',
					title: '蓝色'
				}, {
					value: 'black',
					title: '关闭'
				}],
			}
		},
		props: ['dat'],
		mounted() {
			console.log(this.dat.item)
			if (this.dat.item.color != undefined || this.dat.item.color != null) {
				this.index1 = this.dat.num
			} else {
				this.index1 = -1
			}
		},
		methods: {
			// 下拉框
			xiala: function(e) {
				console.log(e)
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index1 = e.target.value
				console.log(this.dat.num,this.list1[this.index1].value)
				this.$emit('w_xl', this.dat.num, this.list1[this.index1].value)
			},
		}
	}
</script>

<style>
</style>
